<!DOCTYPE html>
<html lang="en"
      xmlns:th="http://www.thymeleaf.org/">
<head th:replace="page/index::head">
    <meta charset="utf-8">
    <title>超市积分后台管理系统</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="icon" th:href="@{/images/favicon.ico}" href="/templates/images/favicon.ico">
    <link rel="stylesheet" th:href="@{/lib/layui-v2.5.5/css/layui.css}"
          href="../../static/lib/layui-v2.5.5/css/layui.css"
          media="all">
    <link rel="stylesheet" th:href="@{/css/layuimini.css}" href="../../static/css/layuimini.css" media="all">
    <link rel="stylesheet" th:href="@{/css/public.css}" href="../../static/css/public.css" media="all">
    <link rel="stylesheet" th:href="@{/lib/font-awesome-4.7.0/css/font-awesome.min.css}"
          href="../../static/lib/font-awesome-4.7.0/css/font-awesome.min.css" media="all">
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
        .layui-form-item .layui-input-company {width: auto;padding-right: 10px;line-height: 38px;}
    </style>
</head>
<body class="layui-layout-body layuimini-all">
<div class="layui-layout layui-layout-admin">

    <div class="layui-header header" th:replace="page/index::nav">

    </div>

    <div class="layui-side layui-bg-black" th:replace="page/index::left">

    </div>

    <div class="layui-body">

        <div class="layuimini-content-page ">
            <!--初始化中间内容-->
            <div class="layuimini-container layui-anim layui-anim-upbit" >
                <div class="layuimini-main">

                    <div class="layui-form layuimini-form">
                        <div class="layui-form-item">
                            <label class="layui-form-label required">旧的密码</label>
                            <div class="layui-input-block">
                                <input type="password" name="passwordOld" lay-verify="required" lay-reqtext="旧的密码不能为空" placeholder="请输入旧的密码"  value="" class="layui-input">
                                <tip>请输入账号旧密码</tip>
                            </div>

                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label required">新的密码</label>
                            <div class="layui-input-block">
                                <input type="password" id="new_pwd" name="passwordNew" lay-verify="required" lay-reqtext="新的密码不能为空" placeholder="请输入新的密码"  value="" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label required">确认密码</label>
                            <div class="layui-input-block">
                                <input type="password" id="again_pwd" name="passwordAgn" lay-verify="required" lay-reqtext="新的密码不能为空" placeholder="请输入新的密码"  value="" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <div class="layui-input-block">
                                <button class="layui-btn" lay-submit lay-filter="saveBtn">确认保存</button>
                            </div>
                        </div>
                    </div>
                    <p class="errorMag" style="width: 318.4px;height: 30px;text-align: center;color: crimson" ></p>
                </div>
            </div>
        </div>
    </div>

</div>

<script th:src="@{/lib/jquery-3.4.1/jquery-3.4.1.min.js}" src="../../static/lib/jquery-3.4.1/jquery-3.4.1.min.js"
        charset="utf-8"></script>
<script th:src="@{/lib/layui-v2.5.5/layui.js}" src="../../static/lib/layui-v2.5.5/layui.js?v=1.0.4"
        charset="utf-8"></script>
<script th:src="@{/js/lay-config.js}" src="../../static/js/lay-config.js?v=1.0.4" charset="utf-8"></script>

<script type="text/javascript">

    layui.use([ 'layer', 'layuimini'], function () {

        $('.login-out').on("click", function () {
            layer.msg('正在退出登录', function () {
                window.location = '/user/logout';
            });
        });
        /*layuimini.listen();*/

    });

    layui.use(['form'],function () {
        var form = layui.form,
            layer = layui.layer;
        //监听提交
        form.on('submit(saveBtn)', function (data) {

            data = data.field;
            //校验一下两次输入的是不是相同
            if (data.passwordNew != data.passwordAgn){
                layer.msg('两次输入的新密码不一致');
                return false;
            }


            $.ajax({
                data:data,
                url:"/user/reset_password",
                method:'POST',
                dataType:'json',
                async:true,
                cache: false,
                success:function(result){
                    //更新密码失败

                    if (result.status!=0){
                        layer.alert(result.msg);
                        /*$('.errorMag').html(result.msg);*/
                        return false;
                    }else{
                        //修改成功
                        /*alert("正在前往首页");*/
                        window.location.href="/user/";
                    }
                    console.log(result);
                },
            });

            return false;
        });
    });
    /*头像上传*/
    $(".uploadAvatar").click(function () {
        layer.open({
            type: 1
            , title: '上传头像' //不显示标题栏
            , closeBtn: 2
            , area: '300px;'
            , id: 'upload-avatar' //设定一个id，防止重复弹出
            , resize: false
            , btnAlign: 'c'
            , moveType: 1 //拖拽模式，0或者1
            , content: $(".magt3")

        });
        layui.use('upload', function () {
            var upload = layui.upload;
            var uploadInst = upload.render({
                elem: '#test1'
                ,auto:true

                , url: '/user/projectPictureUpload'
                , method: 'post'
                , accept: 'images'
                , acceptMime: 'image/*'
                , field: 'projectImg'
                ,before: function(obj){
                    //预读本地文件示例，不支持ie8
                    obj.preview(function(index, file, result){
                        $("#demo1").attr('src',result);
                    })}
                , done: function (res) {
                    //如果上传失败
                    if (res.status == 1) {
                        return layer.msg('上传项目图片失败', {icon: 5});
                    }
                    //上传成功,获得图片地址
                    console.log(res.data);

                    $('.avatar').attr('src', res.data);
                    layer.closeAll();
                    // window.location.reload();
                }
                , error: function () {
                    //演示失败状态，并实现重传
                    var demoText = $('#demoText');
                    demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                    demoText.find('.demo-reload').on('click', function () {
                        uploadInst.upload();
                    });
                }
            });
        });
    });

</script>
</body>

<div class="publish" style="padding: 50px; line-height: 22px;
background-color: #393D49; color: #fff; font-weight: 300;">
    <h1></h1><br><br>
    <p>

    </p>
</div>
<!--上传头像框-->
<div class="layui-form layui-form-item magt3">

    <div class="layui-upload">
        <button type="button" class="layui-btn" style="margin-left: 100px;" id="test1">选择图片</button>
        <div class="layui-upload-list">
            <img class="layui-upload-img" id="demo1" style="margin-left:80px;width: 140px;height: 115px;">
            <p id="demoText"></p>
        </div>

    </div>

</div>
</html>




